<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>驾驶员行为监测大数据看板</title>
    <link href="../styles/common.css" rel="stylesheet">
    <script src="../scripts/Plugin/jquery-3.3.1.min.js"></script>
    <script src="../scripts/Plugin/echarts.min.js"></script>
    <script src="../scripts/Plugin/bmap.min.js"></script>
    <script src="http://api.map.baidu.com/api?v=2.0&ak=LelFSt6BfykGf8m3PB5zr8LaXAG2cMg6"></script>
    <script src="../scripts/common.js"></script>
    <script src="../scripts/index.js"></script>
    <script src="../scripts/Plugin/laydate/laydate.js"></script>
</head>
<body>
<!--顶部-->
<header class="header left">
    <div class="left nav">
        <ul>
            <li class="nav_active"><i class="nav_1"></i><a href="index.html">整体概览</a> </li>
            <li><i class="nav_2"></i><a href="quota.html">本地站点</a> </li>
            <li><i class="nav_3"></i><a href="trend.html">行为分析</a> </li>
            <li><i class="nav_4"></i><a href="quota2.html">附近站点</a> </li>
            </ul>
    </div>
    <div class="header_center left" style="position:relative">

        <h2><strong>驾驶员行为监测大数据看板</strong></h2>

    </div>
    <div class="right nav text_right">
        <ul>

        </ul>
    </div>

</header>
<!--内容部分-->
<div class="con left">
    <!--数据总概-->
    <div class="con_div">
        <div class="con_div_text left">
            <div class="con_div_text01 left">
                <img src="../images/info_1.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>当前数据更新时间</p>
                    <p>18：30</p>
                </div>
            </div>
            <div class="con_div_text01 right">
                <img src="../images/info_2.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>下次数据更新时间</p>
                    <p>19：00</p>
                </div>
            </div>
        </div>
        <div class="con_div_text left">
            <div class="con_div_text01 left">
                <img src="../images/info_3.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>当日违规总量</p>
                    <p class="sky">3614</p>
                </div>
            </div>
            <div class="con_div_text01 right">
                <img src="../images/info_4.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>本周违规总量</p>
                    <p class="sky">16219</p>
                </div>
            </div>
        </div>
        <div class="con_div_text left">

            <div class="con_div_text01 left">
                <img src="../images/info_5.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>当日平台访问量</p>
                    <p class="org">5855</p>
                </div>
            </div>
            <div class="con_div_text01 right">
                <img src="../images/info_6.png" class="left text01_img"/>
                <div class="left text01_div">
                    <p>本周平台访问量</p>
                    <p class="org">19560</p>
                </div>
            </div>
        </div>
    </div>
    <!--统计分析图-->
    <div class="div_any">
        <div class="left div_any01">
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_1.png">最近违规内容分布占比</div>
                <p id="pieChart1" class="p_chart"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_2.png">当日实时投诉量总计</div>
                <p id="histogramChart" class="p_chart"></p>
            </div>
        </div>
        <div class="div_any02 left ">
            <div class="div_any_child div_height">
                <div class="div_any_title any_title_width"><img src="../images/title_0.png">近期情况</div>
                <div id="mapChart" style="width:97.5%;height:95%;display: inline-block;padding-left: 1.25%;padding-top:2.2%"></div>
            </div>
        </div>
        <div class="right div_any01">
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_3.png">平台实时好评量</div>
                <p id="lineChart" class="p_chart"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_4.png">平台实时差评量</div>
                <!-- <p id="lineChart2" class="p_chart"></p> -->
                <div class="table_p" style="height: 96%;margin-top: 20px;">
                    <table>
                        <thead><tr>
                            <th>情况统计</th>
                            <th>司机原因</th>
                            <th>平台分析</th>
                            <th>情况次数</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr><td>1</td><td>一周内驾驶员行为分析</td><td>违规</td><td><button class="btn btn-primary btn-sm">共10次</button></td></tr>
                        <tr><td>2</td><td>戴口罩</td><td>违规</td><td><button class="btn btn-primary btn-sm">4次</button></td></tr>
                        <tr><td>3</td><td>戴安全带</td><td>正常</td><td><button class="btn btn-primary btn-sm">0次</button></td></tr>
                        <tr><td> 4 </td><td>玩手机</td><td> 正常</td><td><button class="btn btn-primary btn-sm">0次</button></td></tr>
                        <tr><td> 5 </td><td>犯困</td><td>  正常</td><td><button class="btn btn-primary btn-sm">0次</button></td></tr>
                        <tr><td> 6 </td><td>行驶时看前方</td><td> 违规   </td><td><button class="btn btn-primary btn-sm">3次</button></td></tr>
                        <tr><td> 7 </td><td>喝酒</td><td>  正常  </td><td><button class="btn btn-primary btn-sm">0次</button></td></tr>
                        <tr><td> 8 </td><td>手放方向盘上</td><td>   违规 </td><td><button class="btn btn-primary btn-sm">共03次</button></td></tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>


</div>
</body>
</html>
